<template>
	<view class="content">
		<!-- header -->
		<view class="works-header">
			<uni-card title="九阵科技" :isFull="true" :sub-title="subTitle" extra="More..." :thumbnail="avatar">
				<text class="uni-body">{{info}}</text>
			</uni-card>
		</view>
		<!-- 模态框内容 -->
		<view class="modal-content">
			<view class="header">
				<!-- 关闭按钮 -->
				<!-- <uni-icons type="close" size="20" @click="closeModal"></uni-icons> -->
			</view>
			<view class="main">
				<image src="../../static/images/NoContents.png" mode=""></image>
				<text>{{content}}</text>
			</view>
			<!-- foot -->
			<view class="feet">
				
			</view>
		
		</view>
		<!-- cont -->
		<view class="works-cont">
			<view class="works-cont-choose">
				<li>
					<image src="@/static/tabBarLogo/house.png" mode=""></image>
				</li>
				<li>
					<image style="width: 22px;height: 22px;" src="@/static/tabBarLogo/menu.png" mode=""></image>
				</li>
				<li>
					<image src="@/static/tabBarLogo/new.png" mode=""></image>
				</li>
				<li>
					<image src="@/static/tabBarLogo/tool.png" mode=""></image>
				</li>
			</view>
		</view>
		<!-- feet -->
		<view class="works-feet">
			
		</view>
		
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				subTitle:'There is currently no explanation',
				info:'选择了这个职业，就选择了奉献精神。 向您致敬！',
				cover: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg',
				avatar: '../../static/logo/Nielogo.png',
				extraIcon:{
					color: '#4cd964',
					size: '22',
					type: 'gear-filled'
				},
				// axios接口所需参数
				startTime:'',  //参数 - 开始时间
				endTime:'',  //参数 - 结束时间
				title: '提示',
				content: '暂无内容',
				// showModal参数
				infos:[],
			}
		},
		methods: {
	
			
		}
		
	}
</script>

<style lang="scss">
::v-deep .uni-card .uni-card__header .uni-card__header-content .uni-card__header-content-title[data-v-80554eb4]{
	font-size: 12px;
}
::v-deep .uni-card .uni-card__header .uni-card__header-content[data-v-80554eb4]{
	align-items: center;
}
::v-deep .uni-card .uni-card__header .uni-card__header-avatar[data-v-80554eb4]{
	margin: 0;
}
.modal-content {
	/* 设置背景图片 */
	background-image: url('@/static/images/NoContentsBg.png');
	background-size: cover;
	/* 背景图片覆盖整个盒子 */
	background-position: center;
	/* 背景图片居中 */
	height: 168px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	background-color: #fff;
	
	border-radius: 8px;

	.main {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		image {
			width: 60px;
			height: 40px;
		}

		text {
			display: flex;
			justify-content: center;
			align-items: center;
			text-align: center;
			flex-wrap: wrap;
			font-size: 18px;
			margin-top: 12px;
			// font-weight: 600;
			/*设置渐变的方向从左到右 颜色从***到***/
			 background: linear-gradient(to left, #b6b6b6, #55557f); 
			  -webkit-background-clip: text;/*将设置的背景颜色限制在文字中*/
			  -webkit-text-fill-color: transparent;/*给文字设置成透明*/
			}
		}
	}
		
.works-cont{
	.works-cont-choose{
		margin-top: 2px;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		padding: 4px;
		background-color: #fff;
		li{
			text-align: center;
			cursor: pointer;
			flex: 1;
			list-style-type: none;
			image{
				width: 30px;
				height: 30px;
			}
		}
	}
}
</style>


